{% extends "../base.html" %}

{% block title %} pyutility:Google Map {% endblock title %}

{% block header %}
<meta name="keywords" content="python 工具  pyutility Google Map" />
<script 
src="http://maps.google.com/maps?file=api&v=2&key={{apikey}}&sensor=false"
type="text/javascript">
</script>
<script type="text/javascript" src="/js/map.js" ></script>
<script type="text/javascript" src="/js/mapRuler.js"></script>
<script language="javascript" type="text/javascript" src="/js/prototype-1.6.0.3.js"></script>

<script type="text/javascript">
function initialize() {
	if (GBrowserIsCompatible())  {
	   var map = new GMap2(document.getElementById("map_canvas"));
	   var marker;
	   var ruler = new GRulerControl();
	   map.addControl(ruler);
	   ruler.setEnabled(false);
	   map.setCenter(new GLatLng(39.9904, 116.3102), 10);
	   map.addControl(new GSmallMapControl());
       map.addControl(new GMapTypeControl());
       //map.setMapType(G_HYBRID_MAP);
	   map.setUIToDefault();
	   getGeoInfo(map,marker);
	   //alert(GEvent);
	   
	   GEvent.addListener(map,"singlerightclick", function(point) {
	   	//alert(point);
	   	var initPt = map.fromContainerPixelToLatLng(point);
	   	//alert(initPt);
	   	$("latlng").innerHTML=initPt;
	   	
	   });

	}
}
</script>
<script>
window.onload=function() {
	initialize();
}
window.onunload=function() {
	GUnload();
}
</script>
{% endblock header %}
 
{% block content %}

<div class="nav">
<a  href="/">返回首页</a>
</div>

<div id="map_canvas" style="width:720px;height:500px;float:left;overflow:hidden;"></div>
<div id="latlng"></div>
<div id="right" style="margin-left:110px;width:320px;height:500px;float:right;">
<pre>
数据版本:
IP位置数据来自 MaxMind<sup>&reg;</sup>提供的<a href="http://geolite.maxmind.com/download/geoip/">GeoLiteCity</a>
版本:Apr 1,2009
</pre>
</div>
</blockquote>


{% endblock content %}